<template>
  <div id='registerlist'>
    <el-row>
      <el-col :span="24" style="margin-left:10px;margin-top:10px">
        快速查询
        <el-input
          size='small'
          v-model="patientName"
          placeholder="请输入患者名"
          style="width: 200px"
        />
        <el-button
          size='small'
          @click="getRegisterlistByname()"
          type="primary"
          icon="el-icon-search"
        ></el-button>
                <el-button type="" size='small'  @click="reslt()" >重置</el-button>
      </el-col>
    </el-row>
    <el-table
      class="mt"
      :data="
        registerlist.slice((currentPage - 1) * pageSize, currentPage * pageSize)
      "
      height="493"
      border
      style="width: 100%"
      :header-cell-style="{
        backgroundColor: '#eef5ff',
        textAlign: 'center',
      }"
      :cell-style="{ textAlign: 'center' }"
    >
      <el-table-column prop="registrationNumber" label="挂号编号" width="180" />
      <el-table-column
        prop="dzmHisRegisteredfee.registeredfeeAggregateAmount"
        label="挂号费用（元）"
      />
      <el-table-column
        prop="dzmHisDepartment.departmentName"
        label="科室名称"
      />
      <el-table-column prop="dzmHisDoctor.trueName" label="医生姓名" />
      <el-table-column prop="dzmPatient.name" label="患者姓名" />
      <el-table-column label="挂号时间">
        <template slot-scope="sc">
          {{ new Date(sc.row.createTime * 1000).toLocaleDateString() }}
        </template>
      </el-table-column>
      <el-table-column prop="dzmHisSchedulingWeek.date" label="就诊时间" />
      <el-table-column
        prop="dzmHisRegisteredfee.registeredfeeName"
        label="挂号类型"
      />
      <el-table-column label="状态">
        <template slot-scope="sc">
          <i v-if="sc.row.registrationStatus == 1">待就诊</i>
          <i v-if="sc.row.registrationStatus == 2">已就诊</i>
          <i v-if="sc.row.registrationStatus == 3">已退号</i>
          <i v-if="sc.row.registrationStatus == 4">作废</i>
          <i v-if="sc.row.registrationStatus == 5">未付款</i>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="sc">
          <el-button
            @click="payorrefund(sc.row, 1)"
            size="mini"
            v-if="sc.row.registrationStatus == 1"
            type="primary"
            >去退号</el-button
          >
          <el-button
            size="mini"
            @click="payorrefund(sc.row, 2)"
            v-if="
              sc.row.registrationStatus == 5 || sc.row.registrationStatus == 6
            "
            type="warning "
            >去付款</el-button
          >

          <el-tag v-if="sc.row.registrationStatus == 4" type="danger"
            >已作废</el-tag
          >
          <el-tag v-if="sc.row.registrationStatus == 3" type="danger"
            >已退号</el-tag
          >
          <el-tag v-if="sc.row.registrationStatus == 2" type="success"
            >已完成</el-tag
          >
        </template>
      </el-table-column>
    </el-table>
    <div class="mt" >
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage"
        :page-size="pageSize"
        layout="total, prev, pager, next"
        :total="registerlist.length"
      >
      </el-pagination>
    </div>
    <div v-html='pagehtml'></div>
  </div>
</template>
<script>
import { loading,Sloading} from "../../api/doctor/tools/loading";
import { open2, open3, open4 } from "../../api/doctor/tools/alert";

import {getpagehtml} from "../../api/doctor/zfb";
 import {
  getRegisterlist,
  getRegisterlistByname,
  payOrRef,
} from "@/api/doctor/registerlist";
export default {
  name: "Registerlist",
  data() {
    return {
      loading:true,
      //根据患者姓名 模糊查询
      patientName: "",
      //默认
      activeName: "first",
      //挂号列表
      registerlist: [],
      //分页=当前页
      currentPage: 1,
      pageSize: 8,
      //支付包
      pagehtml:""
    };
  },

  methods: {
    //模糊查询
    getRegisterlistByname() {
      getRegisterlistByname({ patientName: this.patientName }).then((re) => {
        this.registerlist = re.data;
      });
    },
    //分页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage = val;
    },
    //付款or退号
    payorrefund(e, i) {
        console.log(e)
        this.$router.push({
        path: "zfb",
        query: {i:i,reg:JSON.stringify(e)}
        });
    },
    //重置
    reslt(){
        this.patientName=''
          getRegisterlist().then((re) => {
            this.registerlist = re.data;
          });
    }
  },

  mounted() {
    getRegisterlist().then((re) => {
      this.registerlist = re.data;
    });
  },
};
</script>
<style scoped>
*{
  font-weight: bold;
}
.mt{
  margin-top:20px
}
#registerlist{
box-shadow:  0px 0px 15px #98d3e7;
}
</style>

